<template>
    <div style="width: 100%;margin: 10px auto;">
        <div class="operation" >
        <el-row type="flex" class="row-bg" justify="start">
            <el-input placeholder="请输入患者名" prefix-icon="el-icon-search" clearable @clear="initData" style="width: 450px;margin-right: 10px" v-model="keyword" @keydown.enter.native="search"></el-input>
            <el-button icon="el-icon-search" type="primary" @click="search">
                搜索
            </el-button>
            <el-col >
                <el-button type="primary" icon="el-icon-plus"  @click="addDepAction" :disabled="this.notNurse">
                    添加病房</el-button>
            </el-col>
        </el-row>
        </div>
        <el-table
                :header-cell-style="{background:'#c3e0cd',color:'#606266'}"
                :fit="true"
                :data="ward"
                border
                style="margin: 15px">
            <el-table-column
                    type="selection"
                    >
            </el-table-column>
            <el-table-column
                    fixed
                    prop="number"
                    label="病房号"
                    min-width="80">
            </el-table-column>

            <el-table-column
                    prop="bedNumber"
                    label="病床号"
                    min-width="80">
            </el-table-column>
            <el-table-column
                    prop="empty"
                    label="状态"
                    min-width="170">
                <template slot-scope="scope">
                    <el-switch
                            v-model="scope.row.empty"
                            :active-value="false"
                            :inactive-value="true"
                            inactive-color="#13ce66"
                            active-color="#ff4949"

                            active-text="不空闲"
                            inactive-text="空闲"
                            @change="changeStatus(scope.row)"/>
                </template>
            </el-table-column>
            <el-table-column
                    prop="capacity"
                    label="病房床数"
                    min-width="80">
            </el-table-column>
            <el-table-column
                    prop="patientName"
                    label="患病姓名"
                    min-width="80">
            </el-table-column>
                <el-table-column
                        prop="patientId"
                        label="病人id"
                        v-if="false"
                        >
                </el-table-column>
            <el-table-column
                    prop="departmentName"
                    label="所属科室"
                    min-width="80">
            </el-table-column>
            <el-table-column
                    prop="inTime"
                    label="入住病房时刻"
                    min-width="150">
            </el-table-column>

            <el-table-column
                    fixed="right"
                    label="操作"
                    min-width="100">
                <template slot-scope="scope">

                    <el-button  :disabled="!scope.row.empty" @click="editData(scope.row)" type="primary" round size="small">分配病床</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="[5, 10, 20, 40]"
                :page-size="pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total">
        </el-pagination>
        <el-dialog
                title="提示"
                :visible.sync="dialogVisible"
                width="30%">
            <el-form :model="form" >
                <el-form-item label="病房名称" :label-width="formLabelWidth"  >
                    <el-input v-model="form.number" autocomplete="off" ></el-input>
                </el-form-item>
                <el-form-item label="病房容量" :label-width="formLabelWidth">
                    <el-input v-model="form.capacity" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="所属科室" :label-width="formLabelWidth">
                    <el-select v-model="form.departmentName" :placeholder="form.departmentName">
                        <el-option v-for = "item in departments" :label="item.name" :value="item.name"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="pushData">确 定</el-button>
            </span>
        </el-dialog>


        <el-dialog
                title="提示"
                :visible.sync="editDialogVisible"
                width="30%">
            <el-form :model="form">
                <el-form-item label="病房号" :label-width="formLabelWidth"  >
                    <el-input v-model="form.number" autocomplete="off" disabled="true"></el-input>
                </el-form-item>
                <el-form-item label="床位号" :label-width="formLabelWidth">
                    <el-input v-model="form.bedNumber" autocomplete="off" disabled="true"></el-input>
                </el-form-item>
                <el-form-item label="患者住院状态" :label-width="formLabelWidth" v-if="false">
                    <el-switch
                            v-model="form.empty"
                            :disabled="true"
                            :active-value="true"
                            :inactive-value="false"
                            active-color="#13ce66"
                            inactive-color="#ff4949"
                            active-text="出院"
                            inactive-text="住院"
                    />
                </el-form-item>
                <el-form-item label="病人姓名" :label-width="formLabelWidth">
                    <el-select v-model="form.patientId" :placeholder="form.patientName">
                        <el-option v-for = "item in patients" :label="item.name" :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="clearForm">取 消</el-button>
                <el-button type="primary" @click="pushEditData">确 定</el-button>
            </span>
        </el-dialog>

    </div>
</template>

<script>
    import MY from "../../global_variable";

    export default {
        name: "Ward",
        data(){
            return {
                notNurse:JSON.parse(sessionStorage.getItem("user")).role==3,
                keyword:'',
                ward:[],
                dialogVisible:false,
                emptyVisible:false,
                addPatientVisible:false,
                editDialogVisible:false,
                form:{
                    number:'',
                    departmentName:'',
                    capacity:'',
                    patientId:'',
                    patientName:'',
                    bedNumber:'',
                    empty:''
                },
                patients:[],
                departments:[],
                formLabelWidth: '120px',
                total:0,
                currentPage:1,
                pageSize:5,
                oneRow:{},
                wards:[]
            }
        },
        mounted(){
            this.initData()
        },
        methods:{
            search(){
                this.getRequest(MY.myURL+'/ward/fuzzyQueryWardProByPatientName',{patientName:this.keyword}).then(resp=>{
                    console.log('------------')
                    console.log(resp)
                    console.log('--------------')
                    if(resp.data.code=='4010'){
                        this.wards=resp.data.data
                        this.total=this.wards.length
                        let begin=0
                        let end=0
                        if(Math.ceil(this.total/this.pageSize)<this.currentPage){
                            begin=0
                            end=this.pageSize
                            this.currentPage=1
                        }else{
                            begin=(this.currentPage-1)*this.pageSize
                            end=(this.currentPage*this.pageSize)
                        }
                        this.ward=this.wards.slice(begin,end)
                        console.log(this.doctor)
                        /*for(var i=0;i<this.ward.length;i++){
                            this.$set(this.ward[i],'patientName','暂无')
                            console.log(this.ward[i])
                        }
                        for(var j=0;j<this.ward.length;j++){
                            var item=this.ward[j]
                            if(this.ward[j].empty==true){
                                continue;
                            }
                            var p={
                                patientId:item.patientId
                            }
                            console.log(p)
                            this.fu(item,p)
                        }*/
                    }
                })
            },

            addDepAction(){
                this.dialogVisible=true;
                this.getRequest(MY.myURL+'/department/getDepartments').then(resp=>{
                    console.log(resp.data.code=='4010')
                    if(resp.data.code=='4010'){
                        this.departments=resp.data.data
                    }
                })

            },
            pushData(){
                if (this.form.departmentName == '') {
                    this.$message({
                        message: '该检查项目的所属科室不能为空',
                        type: 'error'
                    });
                }else{
                    this.getRequest(MY.myURL+'/ward/insertWards',this.form).then(resp=>{
                        if(resp.data.code=='4001'){
                            this.$message({
                                message: resp.data.message,
                                type: 'success'
                            })
                            this.dialogVisible=false
                            this.clearForm()
                            //this.refreshData()
                            if(this.keyword!=''){
                                this.search();
                            }else{
                                this.pageRequest(Math.ceil((this.total+1)/this.pageSize),this.pageSize)

                            }
                        }else{
                            this.$message.error(resp.data.message+' 该病房号已存在');
                            this.editDialogVisible=false
                        }
                    })
                }

            },
            deleteClick(row){
                console.log(row)
            },
            editData(row){
                this.initForm(row)
                console.log(this.form)
                console.log('++++++++++++++')
                console.log(row)
                console.log('+++++++++++++++++')
                this.editDialogVisible=true
                this.getRequest(MY.myURL+'/patient/getAllPatients').then(resp=>{
                    if(resp.data.code=='4010'){
                        this.patients=resp.data.data
                        console.log('获取的病人信息')
                        console.log(this.patients)
                    }
                    console.log(resp)
                })
            },
            emptyData(){
                var pn={
                    number:this.oneRow.number,
                    bedNumber:this.oneRow.bedNumber,
                    departmentName:this.oneRow.departmentName,
                    patientId:this.oneRow.patientId,
                    empty:this.oneRow.empty
                }
                if(this.oneRow.empty==true){
                    console.log('床位空闲')
                    this.getRequest(MY.myURL+'/ward/updateWard',pn).then(resp=>{
                        console.log(resp)
                        if(resp){
                            this.ward=resp.data.data.records
                            this.total=resp.data.data.total
                            this.freshData()
                       }
                    })
                }else{
                    console.log('病人入住')
                    this.addPatientVisible=true
                    this.getRequest(MY.myURL+'/patient/getAllPatients').then(resp=>{
                        if(resp.data.code=='4010'){
                            this.patients=resp.data.data
                            this.emptyVisible=false
                            console.log('获取的病人信息')
                            console.log(this.patients)
                        }
                        console.log(resp)
                    })

                }

                console.log(this.oneRow)
            },
            addPatientData(){
                var pn={
                    number:this.oneRow.number,
                    bedNumber:this.oneRow.bedNumber,
                    departmentName:this.oneRow.departmentName,
                    patientId:this.oneRow.patientId,
                    empty:this.oneRow.empty
                }
                console.log('提交信息')
                console.log(pn)
                this.getRequest(MY.myURL+'/ward/updateWardStatus',pn).then(resp=>{
                    console.log(resp)
                    if(resp){
                        this.ward=resp.data.data.records
                        this.total=resp.data.data.total
                        this.addPatientVisible=false
                        this.freshData()
                    }
                })

            },
            changeStatus(row){
                this.emptyVisible=true
                this.oneRow=row
                //this.emptyData(row)
                this.initForm(row)
                this.getRequest(MY.myURL+'/ward/updateWardStatus',this.form).then(resp=>{
                    console.log(resp)
                    if(resp){
                      if(resp.data.code=='4009'){
                          this.$message({
                              message: "该床位已改为非空闲",
                              type: 'success'
                          });
                          this.pageRequest(this.currentPage,this.pageSize)
                      }else if(resp.data.code=='4011'){
                          this.$message({
                              message: "该病人还未办理出院手续，暂不能回收床位",
                              type: 'error'
                          });
                          this.pageRequest(this.currentPage,this.pageSize)
                      }
                    }
                })

            },
            handleSizeChange: function (size) {
                this.pageSize = size;
                console.log(this.pageSize)  //每页下拉显示数据
                if(this.keyword!=''){
                    this.search()
                }else{
                    this.pageRequest(1,this.pageSize)
                }
            },
            handleCurrentChange: function(currentPage){
                this.currentPage = currentPage;
                if(this.keyword!=''){
                    this.search()
                }else{
                    this.pageRequest(currentPage,this.pageSize)
                }
                console.log(this.currentPage)  //点击第几页
            },
            refreshData(){
                this.initData()
            },
            freshData(){
                for(var i=0;i<this.ward.length;i++){
                    this.$set(this.ward[i],'patientName','暂无')
                    console.log(this.ward[i])
                }
                for(var j=0;j<this.ward.length;j++){
                    var item=this.ward[j]
                    if(this.ward[j].empty==true){
                        continue;
                    }
                    var p={
                        patientId:item.patientId
                    }
                    console.log(p)
                    this.fu(item,p)

                }

            },
            pageRequest(start,size){
                var pn={
                    pageNum:start,
                    pageSize:size
                }
                this.getRequest(MY.myURL+'/ward/getWardByPage',pn).then(resp=>{
                    console.log('分页')
                    console.log(resp)
                    if(resp){
                        this.ward=resp.data.data.listPros
                        this.total=resp.data.data.total
                        this.currentPage=pn.pageNum
                       /*for(var i=0;i<this.total;i++){
                            if(this.ward[i]?.empty==true){
                                this.ward[i].patientName='暂无'
                            }
                        }*/
                        console.log('jjjjjjjjjjjjjj')

                    }
                })

            },
            pushEditData(){
                this.getRequest(MY.myURL+'/ward/updateWard',this.form).then(resp=>{
                    console.log('///////////////')
                    console.log(resp)
                    console.log('///////////////')
                    //this.refreshData()
                    if(resp.data.code=='4009'){
                        /*this.$message({
                            message: resp.data.message,
                            type: 'success'
                        }).;*/

                        this.pageRequest(this.currentPage,this.pageSize)

                        this.editDialogVisible=false
                        this.$message({
                            showClose:true,
                            message: "分配病床成功！记得把该病床的状态改为非空闲！",
                            type: 'success'
                        });
                    }else{
                        this.$message.error(resp.data.message);
                        this.editDialogVisible=false
                    }

                })

            },
            async fu(item,p){
                console.log("koko")
                await this.getRequest(MY.myURL+'/ward/getPatientNameByPatientId',p).then(resp1=>{
                    console.log(resp1)
                    //if(resp1.data.code=='4009'){
                    console.log('请求单条数据 ')
                    console.log(item)
                    item.patientName=resp1.data
                    console.log(item)
                    console.log('请求单条数据')

                    // }
                })
            },
            initData(){
                this.pageRequest(1,5)
            },

           initForm(row){
                this.form.number=row.number
               this.form.bedNumber=row.bedNumber
                this.form.departmentName=row.departmentName
                this.form.capacity=row.capacity
               this.form.patientId=row.patientId
               this.form.empty=row.empty
               this.form.patientName=row.patientName
            },
            clearForm(){
                this.form.number=''
                this.form.departmentName=''
                this.form.capacity=''
                this.editDialogVisible=false
            }

        }
    }
</script>

<style scoped>

</style>
